<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        li {
            float: left;
            list-style-type: none;
        }
        li img:hover {
            transform: rotate(360deg) scale(3);
            transition: all 4s ease-in-out 0s;
        }
         .clear:after {
           content: '';
           display: block;
            clear: both;
      }
    </style>
</head>
<body>
<div >
    <ul class="clear">
        <li class="clear"><img class="clear" src="images/delicious.png" height="64" width="64"/></li>
        <li class="clear"><img class="clear" src="images/facebook.png" height="64" width="64"/></li>
        <li class="clear"><img class="clear" src="images/rss.png" height="64" width="64"/></li>
        <li class="clear"><img class="clear" src="images/twitter.png" height="64" width="64"/></li>
        <li class="clear"><img class="clear" src="images/yahoo.png" height="64" width="64"/></li>

    </ul>
</div>

</body>
</html>